<template><div class="footer">
	<div class="input" contenteditable="true" v-on:input="change"></div>
	<div class="footer-icon" style="right:45px;"><img :src="expression" alt=""></div>
	<div class="footer-icon" style="right:0px;" v-on:touchstart="sendMsg(msg)"><img :src="sendIcon" alt=""></div>
	<div></div>
</div></template>

<script>
import CONFIG from '../../common/config.js';
export default {
	data () {
		return {
			inputDom : null,
			msg : '',
			sendIcon : CONFIG.config.resourceDirectory + "send.png",
			expression : CONFIG.config.resourceDirectory + "expression.png"
		}
	},

	mounted () {
		console.log( CONFIG.config );
	},

	methods : {

		change (e) {
			this.msg = e.target.innerText;
			this.inputDom = e.target;
		},

		sendMsg(msg) {
			this.$emit('sendMsg', msg);
			this.msg = '';
			this.inputDom.innerText = '';
		}
	}
}
</script>